<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{.doc.Title}}</title>
<link rel="stylesheet" href="/static/css/common.css">
<link rel="stylesheet" href="/static/js/tui-editor/toastui-editor.min.css" />
<style type="text/css">
    html{height: 100%;}
    body{text-align: center;padding: 0;height: 100%;}
    .toastui-editor-contents{font-family: "微软雅黑",Helvetica,Arial, sans-serif;}
    #docWrapper{margin:0 auto;padding:25px 20px;text-align:left; background-color: #fff;width:920px;box-shadow:0px 0px 8px #ddd;}
    h3{text-align: center;padding: 20px 0;}
</style>
</head>
<body>
<div id="docWrapper">
    <h3>{{.doc.Title}}</h3>
    <div id="editor" style="width: 100%;min-height: 650px;">
    </div>
</div>
<script src="/static/js/tui-editor/toastui-editor-all.min.js"></script>
<script src="/static/js/tui-editor/zh-cn.js"></script>

<script>
    const {Editor}=toastui;
    const viewer = Editor.factory({
        el: document.querySelector('#editor'),
        viewer: true,
        language: 'zh-CN',
        height: 'auto',
        minHeight:'650px',
        initialValue: '{{.doc.Content}}'
    });
</script>
</body>
</html>